<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" type="text/css" href="../css/bootstrap/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="../css/global.css">
	<link rel="stylesheet" type="text/css" href="../css/font-awesome.min.css">
	<link rel="stylesheet" type="text/css" href="../datatables/media/css/jquery.dataTables.min.css">
	<link rel="stylesheet" type="text/css" href="../datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css">
	<style type="text/css">
		.contentTable {
			position: absolute;
			left: -2%;
			top: 155px;
		}
		.subnav {
			position: absolute;
			top: 140px;
		}
		.subnav li {
			font-size: 20px;
			border-bottom: 1px gray solid;
			border-right: 1px gray solid;
			border-radius: 5px;
			border-color: #999999;
			width: 70%;
		}
		.subnav .nav-pills>li.active>a,.subnav .nav-pills>li.active>a:focus,.subnav .nav-pills>li.active>a:hover {
			background-color: #5DC1D0;
		}
		.subnav .nav-pills>li>a {
			border-radius: 4px;
			padding-left: 35px;
		}
		.contentTable table.dataTable thead th, table.dataTable thead td {
			border-bottom: 1px solid rgba(119, 119, 119, 0.31);
		}
		.contentTable table.dataTable.no-footer {
			border-bottom: 1px solid rgba(119, 119, 119, 0.31);
			border-radius: 2px;

		}
		.dataTables_wrapper .dataTables_filter input {
			border-radius: 4px;
		}
		.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{
			height: 25px;
			line-height: 25px;
		}
		.InportExport {
			position: absolute;
			top:-15px;
			z-index: 50;
		}
		.InportExport .btn-primary {
			background-color: #31708f;
			border-color: #31708f;
			margin-left: 13px;

		}
		.progress {
			width: 80%;
			height: 13px;
			margin: 0;
		}
		.progress-bar {
			font-size: 10px;
			line-height: 13px;
			background-color: #768DA2;

		}
		.footer {
			/*height: 60px;*/
			line-height: 19px;
			font-size: 12px;
			background-color: #eeeeee;
			text-align: center;
			margin-top: 50px;
		}
		.copyright {

		}


	</style>
</head>
<body>
	<div class="modal-shiftfix">
		<!-- Navigation -->
		<div class="container-fluid top-bar">
			<div class="pull-left">
				<img src="../img/logo.png" height="43">
			</div>
			<div class="pull-right">
				<ul class="nav navbar-nav pull-right"><!-- .open -->
					<li class="dropdown notifications hidden-xs">
						<a class="dropdown-toggle" data-toggle="dropdown" href="#"><span aria-hidden="true" class="fa fa-gear"></span>
						</a>
					</li>
					<li class="dropdown notifications hidden-xs">
						<a class="dropdown-toggle" data-toggle="dropdown" href="#"><span aria-hidden="true" class="fa fa-sign-out"></span>
						</a>
					</li>
					<li class="dropdown user hidden-xs"><a data-toggle="dropdown" class="dropdown-toggle" href="#">
						<img width="34" height="34" src="../img/head1.jpeg" />John Smith<b class="caret"></b></a>
						<ul class="dropdown-menu">
							<li><a href="#">
								<i class="icon-user"></i>My Account</a>
							</li>
							<li><a href="#">
								<i class="icon-gear"></i>Account Settings</a>
							</li>
							<li><a href="login1.html">
								<i class="icon-signout"></i>Logout</a>
							</li>
						</ul>
					</li>
				</ul>
			</div>
			<button class="navbar-toggle"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="logo" href="index-2.html">se7en</a>
		</div>
		<!-- 横向导航栏 -->
		<div id="main-nav" class="container-fluid main-nav">
			<div class="nav-collapse">
				<ul class="nav">
					<li>
						<a href="#"><span aria-hidden="true" class="fa fa-home"></span>教师科研</a>
					</li>
					<li>
						<a class="current" href="index1.html"><span aria-hidden="true" class="fa fa-pencil-square-o"></span>教师科研</a>
					</li>
					<li>
						<a href="#"><span aria-hidden="true" class="fa fa-file-text"></span>学生科研</a>
					</li>
					<li>
						<a href="#"><span aria-hidden="true" class="fa fa-book"></span>教学平台</a>
					</li>
				</ul>
			</div>
		</div>
	</div>

	<!-- 纵向导航栏 -->
	<div class="container-fluid">
		<div class="row">
			<div class="col-md-2 subnav">
				<ul class="nav nav-pills nav-stacked">
					<li class="active">
						<a href="index1.html">科研项目</a>
					</li>
					<li>
						<a href="#">学术论文</a>
					</li>
					<li>
						<a href="#">专利</a>
					</li>
					<li>
						<a href="#">获奖</a>
					</li>
					<li>
						<a href="#">著作</a>
					</li>
				</ul>
			</div>
			<div class="col-md-10 contentTable col-md-offset-2" >
				<div class="InportExport">
					<button type="button" class="btn btn-primary">导入</button>
					<button type="button" class="btn btn-primary">导出</button>
				</div>
				<table id="ScienceResearch" class="table table-bordered" >
					<thead>
						<tr>
							<th style="width: 200px">科研项目名称</th>
							<th style="width: 200px">科研项目</th>
							<th style="width: 200px">第一责任人</th>
							<th style="width: 200px">内容完整度</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>跨国外包的技术进步效应</td>
							<td><span>横向科研</span></td>
							<td><span>王答复</span></td>
							<td>
								<div class="progress">
									<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
										60%
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>跨国外包的技术进步效应</td>
							<td><span>横向科研</span></td>
							<td><span>王答复</span></td>
							<td>
								<div class="progress">
									<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
										60%
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>跨国外包的技术进步效应</td>
							<td><span>横向科研</span></td>
							<td><span>王答复</span></td>
							<td>
								<div class="progress">
									<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
										60%
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>跨国外包的技术进步效应</td>
							<td><span>横向科研</span></td>
							<td><span>王答复</span></td>
							<td>
								<div class="progress">
									<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
										60%
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>跨国外包的技术进步效应</td>
							<td><span>横向科研</span></td>
							<td><span>王答复</span></td>
							<td>
								<div class="progress">
									<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
										60%
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>跨国外包的技术进步效应</td>
							<td><span>横向科研</span></td>
							<td><span>王答复</span></td>
							<td>
								<div class="progress">
									<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
										60%
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>跨国外包的技术进步效应</td>
							<td><span>横向科研</span></td>
							<td><span>王答复</span></td>
							<td>
								<div class="progress">
									<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
										60%
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>跨国外包的技术进步效应</td>
							<td><span>横向科研</span></td>
							<td><span>王答复</span></td>
							<td>
								<div class="progress">
									<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
										60%
									</div>
								</div>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
<footer class="footer navbar-fixed-bottom ">
	<div class="center-block">
		<!-- <img src="../img/footerlogo.png" width="40"> -->
		<span>地址：浙江省杭州市下沙高教园区学正街18号</span><br><span id="copyright">Copyright © 浙江工商大学ITObase</span>
	</div>
</footer>
<script type="text/javascript" src="../js/jquery-1.12.3.min.js"></script>
<script type="text/javascript" src="../datatables/media/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
	$(function() {
		$('#ScienceResearch').DataTable({
			responsive: true,
			ordering: false,
			searching: true,
			"bLengthChange": false,
			"bRetrieve": true,
					"bFilter": true, //过滤功能
					"aLengthMenu":[15],
				});
	})
</script>
</body>
</html>